import React, { useCallback, useState } from "react";

export default function APP() {
  let a = 1;
  const [name, setName] = useState("xiaoming");
  // react 函数式组件  在每一次重新渲染的时候，都会重新生成一次函数内部的函数和变量
  const testFn = useCallback(() => {
    console.log(name);
  }, [name]);
  const handleClick = () => {
    setName("xiaozheng");
    a++;
    console.log(a);
  };
  return (
    <div>
      <div>
        {name}-{a}
      </div>
      <button onClick={() => handleClick()}>改变名称</button>
      <button onClick={testFn}>打印name</button>
    </div>
  );
}
